<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>首次选择餐厅</title>
		<script type="text/javascript" src="js/jquery-3.3.1.js"></script>
		<script type="text/javascript" src="js/jquery.min.js"></script>
		<script type="text/javascript" src="js/matching.js"></script>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery.cookie.js"></script>
		
		<style>
			body{
				background: url(images/cant2.jpg);
				background-attachment: fixed;
				style=" background-repeat:no-repeat ;
				background-size:100% 100%;
				width: 100%;
			}
			button{
				border-radius: 5px;
				border-color:#388BFF;
				font-size: 25px;
				width: 200px;
				height: 45px;
				/*text-shadow: 0.1em 0.1em 0.15em #388ce5"   文本阴影*/
				color: #FFFFFF;
				background: #007AFF;
			}
			select{
				border-radius: 5px;
				font-size: 20px;
				width: 250px;
				height: 40px;
				color:#388BFF;
				text-align: center;
				margin-top: 1em;;
				margin-bottom: 15px;;
			}
			option{
				width: 250px;
			}
			form{
				margin: 5em 5em 0 5em;
				background-color: rgba(0,0,0,0.5);
			}
			.titlediv{
				text-align: center;
			    -webkit-text-stroke: 2px white;
			    position: relative;
			    text-transform: uppercase;
			    margin: 3vw;
			    color: #9966ff;
			    font-family:"华文彩云";
			    font-size: 5vw;
			    letter-spacing: 1.2vw;
			    font-weight: 700;
				text-shadow: 0 1px 0 #A69895, -1px -1px 0 #A69895, /*main 3d shadow*/ -1px 0px 0 #343437, -2px 1px 0 #343437, -3px 2px 0 #313134, -4px 3px 0 #2f2f31, -5px 4px 0 #2c2c2f, -6px 5px 0 #2a2a2c, -7px 6px 0 #27272a, -8px 7px 0 #252527, -9px 8px 0 #232324, -10px 9px 0 #202022, -11px 10px 0 #1e1e1f, -12px 11px 0 #1b1b1d, -13px 12px 0 #19191a, -14px 13px 0 #161617, -15px 14px 0 #141415, -16px 15px 0 #111112, /*top right*/ 0 -1px 1px #ffffff, 0 -2px 0px #ffffff, /*bottom left corner*/ -15px 14px 0px #ffffff, -16px 15px 0px #ffffff, -17px 16px 0px #ffffff, -18px 17px 0px #ffffff, -2px -1px 0 #ffffff, -3px 0px 0 #ffffff, /*top left corner*/ -19px 15px 0 #ffffff, -18px 14px 0 #ffffff, -17px 13px 0 #ffffff, -16px 12px 0 #ffffff, -15px 11px 0 #ffffff, -14px 10px 0 #ffffff, -13px 9px 0 #ffffff, -12px 8px 0 #ffffff, -11px 7px 0 #ffffff, -10px 6px 0 #ffffff, -9px 5px 0 #ffffff, -8px 4px 0 #ffffff, -7px 3px 0 #ffffff, -6px 2px 0 #ffffff, -5px 1px 0 #ffffff, -4px 0px 0 #ffffff, /*lower right / (upper right side for capital T like H etc letters. */ 0px 2px 0px #ffffff, -1px 3px 0px #ffffff, -2px 4px 0px #ffffff, -3px 5px 0px #ffffff, -4px 6px 0px #ffffff, -5px 7px 0px #ffffff, -6px 8px 0px #ffffff, -7px 9px 0px #ffffff, -8px 10px 0px #ffffff, -9px 11px 0px #ffffff, -10px 12px 0px #ffffff, -11px 13px 0px #ffffff, -12px 14px 0px #ffffff, -13px 15px 0px #ffffff, -14px 16px 0px #ffffff, -15px 17px 0px #ffffff;
			}
			.divBtn{
				text-align: center;
				padding-bottom: 5em;
			}
			.divform{
				width:100%;
				vertical-align:middle;
				margin:0px auto;
				text-align: center;
			}
		</style>
	</head>	
	<body>
		
		<script>
			
		</script>
		
		<div class="titlediv">
			<span>Please Choose Your Restaurant.</span>
		</div>
		
		<div class="divform">
			<form action="">
				<br />
				<select name="cars" id="select_CT">
				</select>
				<div class="divBtn">
					<button type="button" id="btn_val">go</button>
				</div>
			</form>
		</div>
		
		<script>
			
			function a(){
				
				var API_CT = "http://180.141.91.221:8069/RmApi/pos/get_store_list";
				
		        $.ajax({
		            type: "get",       //请求方式
		            url: API_CT,
		            dataType: "json",   //json数据
		            async:true,
		            timeout: 10000,     //设置超时
		            success: function (store_list) { //发送请求成功
		            	
						// $("#select_CT").remove();//清空select列表数据
	                    $("#select_CT").prepend("<option value='0'  selected='selected'>Please Choose</option>");//添加第一个option值
  						for (var i = 0; i < store_list.store_list.length; i++) {
  							
  							//如果在select中传递其他参数，可以在option 的value属性中添加参数
  							//$("#selectSM").append("<option value='"+msg.rows[i].id+"'>"+msg.rows[i]+"</option>");
  							restaurant_id=store_list.store_list[i].id; //餐厅id
	                        restaurant_name=store_list.store_list[i].name;  //餐厅名称
	                        console.log("id="+restaurant_id);
  							$("#select_CT").append("<option value='"+restaurant_id+"'>"+restaurant_name+"</option>");
	                 	}
		            },
		            error: function (XMLResponse) {
                		alert("Server Side Exception！：" + XMLResponse.responseText);
            		}
		       });
		    }
			a();
			
			/*
			 * 选择餐厅事件点击
			 */
			
			$(function() {
				$("#btn_val").click(function() {
					/*
					 *获取select的val值
					 */
					choice_id = $('select  option:selected').val();
					
					if(choice_id=="0"||choice_id==undefined){
						window.location.href = "#"; 
						mui.toast("Please choose a restaurant");
					}else
					{
						/*
						 *localStorage存储数据与对象
						 */
						localStorage.setItem("pos_choice",choice_id);
			        
		        		url = "index.html?id="+choice_id;
		          		window.location.href = url;
						
					}
			        
				});
			});
			$(function() {
					/*
					 *使用方法来读取数据
					 */
				var choice_ct = localStorage.getItem("pos_choice");

				if(choice_ct!=undefined){
						window.location.href = "index.html?id="+choice_ct;
					}
        		else{
	            		window.location.href = "#"; 
	            	}
			});
		</script>
	</body>
</html>
